<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>开通VIP会员</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta content="telephone=no" name="format-detection">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
    <script src="js/rem.js"></script>
    <link href="css/mui.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/main.css">
    <link rel="stylesheet" type="text/css" href="css/common.css"/>
    <link rel="stylesheet" href="css/iconfont.css">
    <link rel="stylesheet" type="text/css" href="css/header.css"/>
    <script src="js/jquery.min.js"></script>
</head>
<body id="openVip" class="bg1">
<header class="mui-bar mui-bar-nav">
		<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		<h1 class="mui-title">我的积分</h1>
	</header>
	<section>
	    <div class="cont-wrap bgWhite mtn">
	        <div class="userInfo-container ver-center">
	            <div class="user-pic"><img src="image/7204816_174933648126_2.png" width="100%" alt=""></div>
	            <div class="user-text">
	                <p class="userName">赵大宝</p>
	            </div>
	        </div>
	    </div>
	    <div class="cont-wrap bgWhite">
	        <div class="cont-head">
	            <a class="cont-title ver-center">
	                <p>充值信息</p>
	            </a>
	        </div>
	        <div class="functionList">
	            <div class="list display-box">
	                <div class="display-box">
	                    <div class="title Center"><h1>充值账号</h1></div>
	                    <div class="arrow Center">
	                        <input type="text" name="transfertype" id="transfer_out_type"  value="185xxxx1529">
	                    </div>
	                </div>
	            </div>
	            <div class="list display-box">
	                <div class="display-box">
	                    <div class="title Center"><h1>充值金额</h1></div>
	                    <div class="arrow Center">
	                    	<input type="text" name="transfertype" id="transfer_out_type" placeholder="0.0元"/>
	                    </div>
	                </div>
	            </div>
	    	</div>
	    </div>
	    <div class="cont-wrap bgWhite">
	        <div class="cont-head">
	            <a class="cont-title ver-center">
	                <p>选择支付方式</p>
	            </a>
	        </div>
	        <div class="cont-main2">
	            <ul class="payStyle cont-li">
	                <li class="ver-center">
	                    <div class="ico Center"><i class="iconfont icon-zhifubaozhifu" style="color:#1983d1"></i></div>
	                    <div class="title flex-1"><h1>支付宝支付</h1></div>
	                    <div class="select" data-id="alipay"><div class="gouxuan"><i class="iconfont icon-xuanze1"></i></div></div>
	                </li>
	                <li class="bbn ver-center">
	                    <div class="ico Center"><i class="iconfont icon-weixinzhifu" style="color:#00bd0b"></i></div>
	                    <div class="title flex-1"><h1>微信支付</h1></div>
	                    <div class="select" data-id="wxpay"><div class="gouxuan"><i class="iconfont icon-xuanze1"></i></div></div>
	                </li>
	            </ul>
	        </div>
	    </div>
	</section>
	<footer class="confirm display-box">
	    <div class="leftCont flex-1 ver-center">
	        <div>
	            <div class="totalPrice">总计：<sapn class="priceNum">0元</sapn></div>
	        </div>
	    </div>
	    <div class="rightCont">
	        <button id="pay">确认支付</button>
	    </div>
	</footer>
	<script src="js/mui.min.js"></script>
	<script src="js/main.js"></script>
	<script src="js/html/common.js"></script>
	<script src="js/html/openVip.js"></script>
	<script type="text/javascript" src="js/fastclick.js"></script>
	<script>
	  $(function() {
			FastClick.attach(document.body);
	  });
	    $('.payStyle li .select').click(function(){
	        $(this).addClass('selected').parents().siblings('li').children('.select').removeClass('selected')
	    })
	    var $buyDes=$('footer .buy-des span');
	    var $Price=$('footer .totalPrice .priceNum');
	    $('.cont-main>ul li').click(function(){
	        $(this).addClass('hover').siblings().removeClass('hover');
	        var num=$(this).children('.vip-type').html();
	        var price=$(this).children('.vip-price').html();
	        $buyDes.html(num)
	        $Price.html(price)
	    })
	</script>
</body>
</html>
